@charset "utf-8";
@import "reset";

body {
  width: 100vw;
  background: url(../img/background.png) no-repeat;
  background-size: 100vw 100vh;

  .wrap {
    .booking {
      padding: vw(100) 0 vw(53) 0;
      margin: vw(180) auto 0 auto;
      width: vw(590);
      height: vw(839);
      background-color: white;
      opacity: 0.6;
      border-radius: vw(15);
      box-shadow: 1px 3px 10px 1px gray;

      .userName {
        margin: 0 vw(28);
        display: inline-block;
        width: vw(265);
        height: vw(20);
        line-height: vw(20);
        border: vw(2) solid #000;
        border-color: transparent transparent #000 transparent;
        text-align: center;
      }

      p{
        text-indent: 2rem;
        font-size: vw(26);
        line-height: vw(42);
        margin: vw(50) vw(28);
      }

      .QRcode{
        margin: 0 auto;
        width: vw(265);
        height: vw(265);
        border: vw(2) solid #000;

        img{
          width: 100%;
          height: 100%;
        }
      }

      button {
        display: inline-block;
        margin: vw(50) vw(200) 0 vw(200);
        width: vw(187);
        height: vw(57);
        font-size: vw(24);
        opacity: 0.9;
        border-radius: vw(29);
        border: none;
        outline: none;
        font-weight: bolder;
        box-shadow: 1px 2px 2px #000;

        a{
          display: inline-block;
          color: #0075c1;
        }
        }
    }
  }
}
